@charset "utf-8";
.container-fluid{
    padding: 0;
    header {
        background: #222222;
        .my_nav {
            border: none;
            background: none;
            margin: 0;
        }
        .navbar-default .navbar-nav>li>a {
            color: #9D9D9D;
        }
        .navbar-default .navbar-nav>.active>a,
        .navbar-default .navbar-nav>.active>a:hover,
        .navbar-default .navbar-nav>.active>a:focus {
            background: #080808;
            color: #FFFFFF;
            border-bottom: 2px solid white;
        }
        .navbar-brand {
            padding: 7px 15px;
        }
        .navbar-default .navbar-nav>li>a:hover {
            background: #080808;
            color: #FFFFFF;
            
        }
        .navbar-default .navbar-nav>.open>a,
        .navbar-default .navbar-nav>.open>a:hover,
        .navbar-default .navbar-nav>.open>a:focus {
            background: #080808;
            color: #FFFFFF;
            
        }
        .navbar-nav > li > .dropdown-menu{
            background: #222222;
            a{
                color:#9D9D9D;
//              background:#E7E7E7;
                &:hover{
                    
                    background: #080808;
                    color: #FFFFFF;
                }
            }
        }
    }
    .layaflash{
        background: #8bc01f;
        .container{
            padding-top: 67px;
            padding-bottom:94px;
            background: url(../img/family/layaboxflash.jpg) no-repeat 80% center;
            .number{
                width: 55px;
                height: 55px;
                background: white;
                color: #8BC01F;
                font-size: 48px;
                border-radius: 2px;
                text-align: center;
                line-height: 55px;
                margin-top: 7px;
            }
            .layaflash_top{
                font-size: 48px;
                color: white;
                padding-bottom: 23px;
            }
            .layaflash_text{
                font-size: 24px;
                color: white;
                padding-bottom: 70px;
            }
            .layaflash_text1{
                font-size: 14px;
                color: white;
                padding-bottom: 32px;
            }
        }
        a{
            display: block;
            width: 102px;
            height: 35px;
            text-align: center;
            line-height: 35px;
            background: white;
            color: #8BC01F;
            border-radius: 2px;
        }
    }
    .layaplayer{
        background: #3393df;
       .container{
            padding-top: 67px;
            padding-bottom:94px;
            background: url(../img/family/play_1.jpg) no-repeat 5%,
                       url(../img/family/play_2.jpg) no-repeat 80% 90%;
            .number{
                width: 55px;
                height: 55px;
                background: white;
                color: #3393df;
                font-size: 48px;
                border-radius: 2px;
                text-align: center;
                line-height: 55px;
                margin-top: 7px;
            }
            .layaflash_top{
                font-size: 48px;
                color: white;
                padding-bottom: 23px;
            }
            .playtop{
                color: white;
                font-size: 24px;
            }
            .playtext{
                font-size: 12px;
                color: white;
                line-height: 30px;
            }
            .margintop_30{
                margin-top: 30px;
            }
            
            
       }
    }
    .airopen{
        .container{
            padding-top: 90px;
            padding-bottom: 87px;
            .number{
                padding:0;
                width: 42px;
                height: 42px;
                background:#3393DF;
                color:white;
                font-size: 36px;
                border-radius: 2px;
                text-align: center;
                line-height: 42px;
                margin-top: 9px;
            }
            .airopen_top{
                font-size: 42px;
                color: #3393DF;
                padding-bottom: 23px;
            }
            .airopen_second{
                font-size: 18px;
                color: #5d5d5d;
            }
            .airopen_biaoti{
                padding-top: 38px;
                color: #3393DF;
                font-size: 18px;
            }
            .airopen_neirong{
                text-indent: 28px;
                padding-top: 21px;
                color: #5d5d5d;
                font-size: 14px;
            }
            .airopen_img{
                margin-top: 41px;
                text-align: center;
            }
        }
    }
    .storepublish{
        background: #f7f7f7;
        .container{
             padding-top: 90px;
            padding-bottom: 87px;
            .number{
                padding:0;
                width: 42px;
                height: 42px;
                background:#3393DF;
                color:white;
                font-size: 36px;
                border-radius: 2px;
                text-align: center;
                line-height: 42px;
                margin-top: 9px;
            }
            .airopen_top{
                font-size: 42px;
                color: #3393DF;
                padding-bottom: 23px;
            }
            .airopen_second{
                font-size: 18px;
                color: #5d5d5d;
            }
            .airopen_biaoti{
                padding-top: 38px;
                color: #3393DF;
                font-size: 18px;
            }
            .airopen_neirong{
                text-indent: 28px;
                padding-top: 21px;
                color: #5d5d5d;
                font-size: 14px;
            }
            .airopen_img{
                margin-top: 41px;
                text-align: center;
            }
        }
    }
    footer{
        background: #3b3b3b;
        .container{
            padding-top: 35px;
            padding-bottom: 35px;
            vertical-align: middle;
            .footer_text{
                div:nth-of-type(1){
                    padding-bottom: 12px;
                    a{
                        color: #a1a3ab;
                        margin-right: 18px;
                    }
                }
                div:nth-of-type(2){
                    font-size: 11.19px;
                    color: #a1a3ab;
                }
            }
            .footer_icon>.margin_middle{
                div{
                   
                    float: left;
                    cursor: pointer;
                    position: relative;
                    
                }
            }
            .hover{
                img:nth-of-type(2){
                    position: absolute;
                    left: 50%;
                    bottom: 100%;
                    transform: translateX(-48%);
                    width: 0;
                    height: 0;
                }
                &:hover{
                    img:nth-of-type(2){
                        transition: all 0.3s ease;
                        width: 142px;
                        height:142px;
                    }
                }
            }
            
            .margin_r_20{
                margin-right: 20px;
            }
        }
        
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .container{
        padding-left: 0;
        padding-right: 0;
        .nav > li > a{
        padding: 14px 4px;
    }
    }
}
@media only screen and (max-width: 991px){
    .container-fluid .layaflash .container{
        background: none;
    }
    .container-fluid .layaplayer .container{
        background: none;
    }
     .footer_text{
            text-align: center;
        }
        .footer_icon{
            padding-top: 15px;
            
        }
        .margin_middle{
            width: 154px;
            margin: 0 auto;
        }
}
